import { Icon, message, Tag } from 'antd';
import * as api from '../utils/api';
import { newScreenfnTree,newPushTree } from '../utils/dataConversion';

const MESSAGEERROR = message.error
export default {

    namespace: 'menu',

    state: {
        dataSource: [],
        columns : [
            {
                title: '图标',
                dataIndex: 'icon',
                key: 'icon',
                width:'10%',
                render: record => <Icon style={{fontSize:17}} type={record} />
            },
            {
                title: '名称',
                dataIndex: 'name',
                key: 'name'
            },
            {
                title: '级别',
                dataIndex: 'level',
                key: 'level',
                render: record =><Tag color={record === 0 ? 'magenta':'cyan'} >{record === 0 ? '目录':'菜单'}</Tag>
            }
        ],
        modal: {},
        visible:false,
        confirmLoading: false,
        icons:["api",
            "appstore",
            "bank",
            "build",
            "compass",
            "carry-out",
            "control",
            "credit-card",
            "dashboard",
            "environment",
            "file-text",
            "hdd",
            "bars",
            "deployment-unit"]
    },
    effects: {
        *getDataSource({ payload }, { call, put }) {
            const res = yield call(api.getMenuTable, payload);
            console.log(res)
            if (res.code === 0) {
                yield put({
                    type: 'updateDataSource',
                    action: Object.assign(res.data)
                })
            } else {
                MESSAGEERROR('(︶︿︶)' + res.msg)
            }
        }
    },
    reducers: {
        'updateDataSource'(state, { action: data }) {
            let newState = Object.assign({}, state)
            newState.dataSource = data
            return newState
        },
        'editDataSource'(state, { action: id }) {
            let newState = Object.assign({}, state)
            newState.dataSource = newState.dataSource.filter(item => item.id !== id)
            return newState
        },
        'showModal'(state, { action = {} }) {
            let newState = Object.assign({}, state)
            newState.visible = !action.visible
            newState.modal = !action.data ? {} : action.data
            return newState
        },
        'handleOk'(state, { action: data }) {
            let newState = Object.assign({}, state)
            newState.confirmLoading = true
            newState.visible = false
            newState.confirmLoading = false
            const { res, fun  } = data
            switch (fun) {
                case 'upDate':
                    newState.dataSource = newScreenfnTree(newState.dataSource,res)
                    break;
                case 'add':
                    newState.dataSource = newPushTree(newState.dataSource,res)
                    break;
                default:
                    break;
            }
            newState.modal = {}
            return newState
        }
    },
};
